import 'package:duqing/components/singer_card.dart';
import 'package:duqing/components/tiny_viedo_card.dart';
import 'package:duqing/models/video_model.dart';
import 'package:duqing/services/video_service.dart';
import 'package:flutter/material.dart';
import 'package:flutter_easyrefresh/easy_refresh.dart';

class TinyVideoPage extends StatefulWidget {
  const TinyVideoPage({Key key}) : super(key: key);

  @override
  _TinyVideoPageState createState() => _TinyVideoPageState();
}

class _TinyVideoPageState extends State<TinyVideoPage>
    with AutomaticKeepAliveClientMixin {
  EasyRefreshController _easyRefreshController;

  int page = 1;
  int limit = 10;
  bool hasMore = true;
  List<VideoItem> _videoList = VideoList([]).list;
  bool err = false;
  String errorMessage;

  @override
  void initState() {
    super.initState();
    _easyRefreshController = EasyRefreshController();
  }

  Future _onLoad() async {
     _getSource(push: true);
    _easyRefreshController.finishLoad(noMore: !hasMore);
  }

  Future _onRefresh() async {
    page = 1;
     _getSource();
    _easyRefreshController.resetLoadState();
  }

  @override
  void dispose() {
    _easyRefreshController.dispose();
  }

  Future _getSource({bool push = false}) async {
    try {
      Map<String, dynamic> result =
          await VideoService.getVideos(page: page);
      VideoList videoList = VideoList.fromJson(result['data']);

      setState(() {
        hasMore = page * limit < result['total'];
        page++;
        if (push) {
          _videoList.addAll(videoList.list);
        } else {
          _videoList = videoList.list;
          print(_videoList.length);
        }
      });
    } catch (e, s) {
      err = true;
      errorMessage = e.toString();
      print(errorMessage);
    }
  }

  @override
  Widget build(BuildContext context) {
    super.build(context);
    return EasyRefresh(
      firstRefresh: true,
      controller: _easyRefreshController,
      onLoad: _onLoad,
      onRefresh: _onRefresh,
      header: ClassicalHeader(),
      footer: ClassicalFooter(),
      child: GridView.builder(
          // gridDelegate: SliverGridDelegateWithMaxCrossAxisExtent(
          //   mainAxisExtent: MediaQuery.of(context).size.width / 1.6,
          //   maxCrossAxisExtent: MediaQuery.of(context).size.width / 2,
          //   mainAxisSpacing: 8,
          //   crossAxisSpacing: 1,
          // ),
          gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
            crossAxisCount: 2,
            mainAxisSpacing: 8,
            crossAxisSpacing: 1,
            childAspectRatio: 9 / 18,
          ),
          itemCount: _videoList.length,
          itemBuilder: (BuildContext context, int index) {
            bool isEven = index.isEven;
            double pl = isEven ? 18 : 9;
            double pr = isEven ? 9 : 18;
            return Container(
              padding: EdgeInsets.only(top: 9, left: pl, right: pr, bottom: 9),
              color: Colors.white,
              child: TinyVideoCard(
                videoItem: _videoList[index],
              ),
            );
          }),
    );
  }

  @override
  bool get wantKeepAlive => true;
}
